<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page import="coop.bancocredicoop.proyectos.gd.controller.altaDocumento.
		AltaDocumentoController" %>
<%@ page import="coop.bancocredicoop.proyectos.gd.domain.Document" %>
<%@ page import="coop.bancocredicoop.proyectos.gd.domain.DocumentType" %>
<%@ page import="java.util.List" %>

<%
	new AltaDocumentoController().run(request);
%>

<%@ include file="../header.jsp" %>

	<link href="${pageContext.request.contextPath}/css/datepicker.css" rel="stylesheet"/>

	<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap-datepicker.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/locales/bootstrap-datepicker.es.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/gd.js"></script>
	<script type="text/javascript">

		var documentTypes;

	    function previewDocument(fileName) {
	        var baseUrl = '${pageContext.request.contextPath}/documento/abrirArchivo';
	        var url = baseUrl + '?fileName=' + fileName;
	        var previewer = GD.DocumentPreviewer();
	        previewer.previewDocument(url, fileName);
	    }

		function useLastCustomer(lastCustomerId, lastCustomerDescription) {
			$('#customerId').val(lastCustomerId);
			$('#customerDescription').val(lastCustomerDescription);
			$('#customer').html(lastCustomerDescription);
		}

		function useLastBox(lastBox) {
			$('#box').val(lastBox);
		}

		function documentTypeSelected() {
			var documentTypeId = $('#documentType').val();
			var docType = documentTypes[documentTypeId];
			$('#purgeable').prop('checked', docType.purgeable);
			setExpirationDate(docType.defaultExpirationDay);
		}

		function setExpirationDate(expirationDate) {
			$('#expirationDate').datepicker('setDate', new Date(expirationDate));
		}

		$(function(){
			$('#expirationDate').datepicker({
				format: 'dd/mm/yyyy',
				todayBtn: 'linked',
				language: 'es'
			});

			var docTypesDataURL = "${pageContext.request.contextPath}/jsp/jsonTiposDocumento/index.jsp?dateFormat=yyyy-MM-dd";
			$.get(docTypesDataURL, function(data) {
				data = jQuery.parseJSON(data.trim());
				documentTypes = data.documentTypes;
				<c:if test="${requestScope.expirationDateYear != null}">
				$('#expirationDate').datepicker('setDate', new Date(${requestScope.expirationDateYear}, ${requestScope.expirationDateMonth - 1}, ${requestScope.expirationDateDay}));
				</c:if>
				<c:if test="${requestScope.expirationDateYear == null}">
				documentTypeSelected();
				$('#documentType').change(documentTypeSelected);
				</c:if>
			});

			<c:if test="${param.customerId != null && param.customerDescription != null}" >
			useLastCustomer("<c:out value="${param.customerId}" />", "<c:out value="${param.customerDescription}" />");
			</c:if>

			<c:if test="${param.box != null}">
			useLastBox("<c:out value="${param.box}" />");
			</c:if>

		});
		
	</script>
		
	<div class="main-panel">
	<div class="panel panel-default">
	<div class="panel-heading"><h2>Legajo</h2></div>
	<div class="panel-body">

   	<!-- BEGIN: flash messages -->
    <c:if test="${!sessionScope.hasErrors && sessionScope.successMessage != null}">
    	<div class="alert alert-success"><c:out value="${sessionScope.successMessage}" /></div> 
    </c:if>
    <c:if test="${sessionScope.hasErrors}">
    	<c:forEach items="${sessionScope.errorMessages}" var="message">
    	<div class="alert alert-danger"><c:out value="${message}" /></div>
    	</c:forEach> 
    </c:if>
    <% 
    	session.setAttribute("hasErrors", null);
    	session.setAttribute("successMessage", null);
    	session.setAttribute("errorMessages", null);
    %>
    <!-- END: flash messages -->

    <c:if test="${needsNewVersionConfirmation}">
	<div class="alert alert-danger">
		El documento posee una versión anterior, corrija los datos o confirme para versionar
	</div> 
    </c:if>

	<button type="button" class="btn btn-default" onclick="previewDocument('<%=request.getParameter("fileName") %>')"><span class="glyphicon glyphicon-eye-open"></span> <%=request.getParameter("fileName") %></button>
	<p></p>

	<form role="form" method="POST">
		<input type="hidden" name="fileName" value="<%=request.getParameter("fileName") %>"/>

		<div class="form-group">
			<label for="customer">Asociado</label>

			<input type="hidden" id="customerId" name="customerId" value="<c:out value="${param.customerId}" />" />
			<input type="hidden" id="customerDescription" name="customerDescription" value="<c:out value="${param.customerDescription}" />" />

			<div class="row">
				<div class="col-xs-9">

				<c:if test="${sessionScope.last != null && sessionScope.last.customerId != null}">
				<div class="input-group">
					<div class="form-control" id="customer">
                    <c:if test="${request.customerId != null}">
                    <span style="color:#aaa"><c:out value="${request.customerDescription}" /></span>
                    </c:if>
                    <c:if test="${request.customerId == null}" >
                    <span style="color:#aaa">Asociado</span>
                    </c:if>
                    </div>
					<span class="input-group-btn">
						<button type="button" class="btn btn-default" onclick="useLastCustomer('${sessionScope.last.customerId}', '${sessionScope.last.customerDescription}');"><span class="glyphicon glyphicon-repeat"></span></button>
					</span>
				</div>
				</c:if>
				<c:if test="${sessionScope.last == null || sessionScope.last.customerId == null}">
					<div class="form-control" id="customer">
                    	<c:if test="${request.customerId != null}">
                    		<span style="color:#aaa"><c:out value="${request.customerDescription}" /></span>
                    	</c:if>
                    	<c:if test="${request.customerID == null }">
                    		<span style="color:#aaa">Asociado</span>
                    	</c:if>
                    </div>
				</c:if>

				</div>

				<div class="col-xs-3">
					<a data-toggle="modal" href="${pageContext.request.contextPath}/jsp/buscarCliente/index.jsp" data-target="#buscarClienteModal" class="btn btn-default">Buscar Asociado</a>
				</div>
			</div>
		</div>

		<div class="form-group">
			<label for="documentType" >Tipo de documento</label>
			<select class="form-control" name="documentType" id="documentType" placeholder="Tipo de documento">
			<% for (DocumentType documentType : (List<DocumentType>) request.getAttribute("listDocumentType")) { %>
				<% if (documentType.getId().toString().equals(request.getParameter("documentType"))) { %>
				<option value="<%=documentType.getId() %>" selected="selected" ><%=documentType.getName() %></option>
				<% } else { %>
				<option value="<%=documentType.getId() %>"><%=documentType.getName() %></option>
				<% } %>  
			<% } %>
			</select>
		</div>

		<fieldset disabled>
			<div class="form-group">
				<label for="purgeable">
					<input type="checkbox" id="purgeable" /> Expurgable
				</label>
			</div>
		</fieldset>

		<div class="form-group">
			<label for="box">Caja</label>

	        <c:if test="${sessionScope.last != null && sessionScope.last.box != null}">
	        <div class="input-group">
	          <input type="text" class="form-control" name="box" id="box" placeholder="Caja" value="<c:out value="${box}" />" >
	          <span class="input-group-btn">
	            <button type="button" class="btn btn-default" onclick="useLastBox('<c:out value="${sessionScope.last.box}" />');"><span class="glyphicon glyphicon-repeat"></span></button>
	          </span>
	        </div>
	        </c:if>
	        <c:if test="${sessionScope.last == null || sessionScope.last.box == null}">
	        <input type="text" class="form-control" name="box" id="box" placeholder="Caja" value="${request.box}">
	        </c:if>
		</div>

		<div class="form-group">
			<label for="expirationDate">Fecha de vencimiento</label>
			<input type="text" class="form-control" id="expirationDate" name="expirationDate" style="max-width: 12em;">
		</div>

		<div class="form-group">
			<label for="notes">Notas</label>
			<textarea class="form-control" id="notes" name="notes" placeholder="Notas"><c:out value="${param.notes}" /></textarea>
		</div>

		 <c:if test="${needsNewVersionConfirmation}">
			<div class="form-group has-error">
				<div class="checkbox">
					<label>
						<input type="checkbox" name="newVersionConfirmed" id="newVersionConfirmed" value="true" /> Confirmar nueva versi&oacute;n
					</label>
				</div>
			</div>
		</c:if>
		<% session.setAttribute("needsNewVersionConfirmation", null); %>

		<div class="form-group">
			<button type="submit" class="btn btn-default">Cargar</button>
		</div>
	</form>

	</div>
	</div>
	</div>
	</div>

	<div class="modal fade" id="buscarClienteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>

<%@ include file="../footer.jsp" %>